<template>
<div class="newUser">
	<div class="topTit">
		<h1>新用户注册</h1>
	</div>
	<div class="con">
		<p>手机号码</p>
		<label>
			<span>+86</span>
			<input type="text" placeholder="请您输入手机号" v-model="phone">
		</label>
		<input type="button" value="下一步" :disabled=' phone == "" ' :class="{active: phone != '' }" class="submit" @click='next'>
	</div>
	<div class="prompt">
		<p>点击【下一步】即表示您同意协议：</p>
		<router-link to='/'>《服务协议》</router-link>
	</div>

    <transition name='breadcrumb'>
		<my-code v-if="childIndex == 1" :phoneStr='phone' @pass='reloadPass'></my-code>
		<pass v-if="childIndex == 2" :phoneStr='phone' :codeStr='code'></pass>
    </transition>
</div>
</template>

<script>
import MyCode from './code'
import Pass from './pass'
import { phoneSendCode, checkCode } from '../../../config/getData.js'

export default {
	data(){
		return {
			phone:'',
			childIndex: 0,
			code:'',
		}
	},
	components: {
		MyCode,
		Pass
	},
	mounted () {
		if(this.$route.params.status !== undefined)
			this.childIndex = this.$route.params.status;

		if(this.$route.params.phone !== undefined){
			this.phone = this.$route.params.phone
			this.code = this.$route.params.code
			this.isReg = false
		}
	},
	methods: {

		//验证码验证
		reloadPass(code){
			//
			// if(this.$route.params.status == 1){
			// 	console.log('这是忘记密码')
			// 	return false
			// }
			checkCode(code).then( res => {

				if(res.code != 2){
					alert(res.msg)
				}else{
					this.code = code;
					this.childIndex = 2
				}
			} )
		},
		next(){
			phoneSendCode(this.phone).then( res => {

				if(res && res.code == 2){
					this.childIndex = 1
				}

			})
		}
	}
}
</script>


<style lang="scss">
@import '../../../assets/css/all';
@import '../../../assets/css/login';
</style>

